import { createRouter, createWebHistory } from 'vue-router'
import { useUserInfo } from '@/stores/userinfo'
import { getParentPath, } from '@/utils/util'
import type { IMenuProps } from '@/interface/common'


const router = createRouter({
    history: createWebHistory(import.meta.env.BASE_URL),
    routes: [
        {
            path: '/login',
            name: 'login',
            component: () => import('../views/login/Login.vue')
        },
        {
            // 框架模板页面
            path: '/',
            name: '主页',
            component: () => import('../views/MenuView.vue'),
            children: [
                // 系统主页
                {
                    path: '/home',
                    name: '系统主页',
                    component: () => import('../views/HomePageView.vue'),
                },
                //   {
                //       path:'/system',
                //       name:'系统管理',
                //       component:()=>import('../views/PageView.vue'),
                //       //  只要要有children就需要在这个模板页面添加路由容器 RouterView
                //       children:[
                //           {
                //               path:'/system/role',
                //               name:'角色管理',
                //               component:()=>import('../views/system/role/Role.vue'),
                //           },
                //           {
                //               path:'/system/user',
                //               name:'用户管理',
                //               component:()=>import('../views/system/user/User.vue'),
                //           }
                //   ]
                //   },
                //   {
                //       path:'/monitor',
                //       name:'系统监控',
                //       component:()=>import('../views/PageView.vue'),
                //       //  只要要有children就需要在这个模板页面添加路由容器 RouterView
                //       children:[
                //           {
                //               path:'/monitor/online',
                //               name:'在线用户',
                //               component:()=>import('../views/monitor/Online.vue'),
                //           }
                //       ]
                //   },

            ]
        }
    ]
})

// vite环境下
var routeFile = import.meta.glob('../views/**/*.vue');

// 路由的前置全局守卫, 路由跳转之前的拦截
router.beforeEach((to, from, next) => {
    // to:到哪里去
    // from:来自哪里
    // next: 路由重定向 ， 必须有next
    
    // 1. 当访问域名的时候， 跳到哪的问题
    if (to.path == '/') {
        const token = localStorage.getItem('token');
        if (token) {
            // 已经登录
            next('/home')
        } else {
            next('/login')
        }
    }

    // 2.判断当前的访问的path是否存在路由表中， 如果存在就放行， 如果不存在就需要动态添加路由
    let routerList = router.getRoutes();// 所有扁平化后的路由

    let curRouter = routerList.find((item) => {
        return item.path == to.path;
    });
    if (curRouter) {
        // 已经存在
        next();
        return;
    }

    // 开始添加动态路由 
    //   1. 访问哪个页面， 就添加添加哪个页面的动态路由
    //   2. 通过循环遍历的方式统一添加动态路由


    const userModel = useUserInfo();
    const menulist = userModel.menus;
    
    function testFun(menulist:IMenuProps[]){
        
        menulist.forEach((option)=>{
            option.children && testFun(option.children)
            if(option.path == '/' || option.path == '*') {
                return;
            }
            const filePath = "../views/" + option.component + ".vue";
            router.addRoute('主页',{
                path: option.path,
                name: option.name,
                component: routeFile[filePath]  
            })
            
        })
    }
   
    testFun(menulist)

    // function addRouterFun(menus: IMenuProps[]) {
    //     menus.forEach((option) => {
    //         // 1.  找当前path的父路由对象， 就可以找到name
    //         // 2.  当前要添加的动态路由
    //         // menus : 我希望就是接口中所有的数据
    //         const parentObj = getParentPath(option.path, menulist);
    //         // 路由表中有没有这个path , 有就添加

    //         if (parentObj.name) {
    //             // 找到父路由
                
    //             // console.log(routeFile);
    //             const filePath = "../views/" + option.component + ".vue";
    //             // if(!(filePath in routeFile)) {
    //             //     console.log(filePath,'你要添加的文件在views文件夹里还没， 请新建');
    //             // }
    //             // 每个路由的name 不能相同， 不然就会有问题
                
    //             // 如何判断一个属性是否是对象中的某个属性呢
    //             router.addRoute(parentObj.name, {
    //                 path: option.path,
    //                 name: option.name,
    //                 // component: routeFile[filePath]
    //                 component: () => import("../views/" + option.component + ".vue")
    //             })
    //         }
    //         // 递归处理 
    //         option.children && addRouterFun(option.children)
    //     })
    // }

    // addRouterFun(menulist)


    // 必须有一个next
    next({
        path: to.path,
        replace: true  // 必须添加
    })


})



export default router
